<template>
  <div>
		<el-table @row-dblclick="props.dbClick" border :data="props.list">
			<el-table-column label="姓名" prop="name"></el-table-column>
			<el-table-column label="手机号" prop="phone"></el-table-column>
			<el-table-column label="电子信箱" prop="email"></el-table-column>
			<el-table-column label="毕业院校" prop="school"></el-table-column>
			<el-table-column label="专业" prop="major"></el-table-column>
			<el-table-column label="学历" prop="qualification"></el-table-column>
			<el-table-column label="状态" v-if="props.caozuo">
				<template #default="scope">
					<el-tag v-if="scope.row.active" type="success">启用</el-tag>
					<el-tag v-else type="danger">禁用</el-tag>
				</template>
			</el-table-column>
			<el-table-column v-if="props.caozuo" label="操作" width="135">
				<template #default="scope">
					<template v-if="scope.row.active" >
						<el-button type="primary" plain size="small" @click="update(scope.row.id)">修改</el-button>
						<el-popconfirm
							:title="'确定要将学生【' + scope.row.name + '】禁用吗'"
							placement="top"
							@confirm="del(scope.row.id, 0)">
							<template #reference>
								<el-button type="danger" plain size="small">禁用</el-button>
							</template>
						</el-popconfirm>
					</template>
					<el-popconfirm
						v-else
						:title="'确定要将学生【' + scope.row.name + '】启用吗'"
						placement="top"
						@confirm="del(scope.row.id, 1)">
						<template #reference>
							<el-button type="success" plain size="small">启用</el-button>
						</template>
					</el-popconfirm>
				</template>
			</el-table-column>
		</el-table>
  </div>
</template>

<script setup>
const props = defineProps({
	list: {
		type: Array,
		required: true
	},
	caozuo: {
		type: Boolean,
		default: false
	},
	dbClick: {
		type: Function,
		default: () => {}
	}
})
const emits = defineEmits(['update', 'del'])
function update (id) {
	emits('update', id)
}
function del (id, active) {
	emits('del', id, active)
}
</script>

<style scoped lang="scss">
</style>